<template>
	<view>
		<view class="order_details_1">
				<view class="order_details_7">
					<text decode="true" class="status">{{Til.talon.hqlb}}</text>
					<text decode="true" class="smallTitle">ID:{{userid}}</text>
				</view>
				<view class="order_details_2" v-for="(item, index) in uqur" :key="index">
					<view class="goods">
						<view class="row">
							<image v-on:click="pic_9_click(item)"  :src="web+item.rasim" mode="scaleToFill" border="0"    class="pic"></image>
							<view class="order_details_10">
								<text decode="true" class="good">{{item.name}}</text>
								<text decode="true" class="num">{{item.usetime}}</text>
							</view>
							<text v-if="item.mode=='0'" decode="true" class="money">{{Til.talon.mf}}</text>
							<text v-if="item.mode=='1'" decode="true" class="money">{{Til.talon.fk}}</text>
							<text v-if="item.mode=='2'" decode="true" class="money">{{Til.talon.adkm}}</text>
						</view>
					</view>
					<view class="iz_order" style="display: flex;">
						<view class="izkm">{{item.km}}</view>
						<view class="izfuzhi" @click="koqur (index)">{{Til.talon.fzkm}}</view>
					</view>
				</view>
			</view>
	</view>
</template>

<script>
	 import utils from '@/utils/utils.js';
	 var app = getApp()
	 export default {
		 data(){
			 return{
				 uqur:[],
				 izkami:'',
				 userid:'',
				 web:''
			 }
		 },
		 computed: {
		     Til() {
		         return this.$t('message');
		     }
		 },
		 onLoad() {
		 	console.log('获取记录')
		 	this.getRecord()
			this.web = getApp().globalData.request_url
		 
		 },
		 onShareAppMessage: function () {
		       return {
		           title: 'izhar发卡1.0',
		           path:  'pages/index/index'
		       }
		   },
		   methods: {
			   getRecord: function getRecord() {
			       var that = this;
			       uni.showLoading({
			           title: "加载中"
			       });
			       uni.login({
			           success: function success(code) {
			               utils.getRequest("/Api/getRecord.php?code=" + code.code).then(function(res) {
			                   console.log(res);
			                   uni.hideLoading();
			                   if (res.data.code == 200) {
								       that.uqur = res.data.recordList
			                           that.userid = res.data.userid
			                   } else {
			                       uni.showModal({
			                           title: "提示",
			                           content: res.data.msg,
			                           showCancel: !1,
			                           confirmText: "重试",
			                           
			                       });
			                   }
			               }).catch(function(res) {
			                   uni.hideLoading();
			                   console.log(res);
			                   uni.showModal({
			                       title: "提示",
			                       content: "网络请求超时",
			                       confirmText: "重试",
			                       
			                   });
			               });
			           }
			       });
			   },
			   
			   koqur (index) {
				var that = this;
				that.izkami = that.uqur[index].km
				that.aq()
			   },
			   aq(){
				   var t = this;
				   uni.setClipboardData({
				   	data: t.izkami,
				   	success: function(t) {
				   		uni.showToast({
				   			title: '复制卡密成功',
				   			icon: "success",
				   			duration: 800
				   		}), setTimeout(function() {
				   			uni.hideToast({});
				   		}, 800);
				   	}
				   });
			   }
		   }
	 }
</script>

<style>
	/* ByizharBegim */
	html,body,#app {height: 100%;width: 100%;}
	.content {height: 100%;width: 100%;}
	uni-page-body,#app {height: 100%;}
	button::after {border: none;width: auto;}
	input{outline: none;border: none;list-style: none;width: auto;}
	.list_item{float: left;}
	.ym_hide{display: none;}
	.ym_show{display: block;}
	.slide-image {  width: 100%;  height:100%;}
	.list_horizontal {width: auto; display:inline-block; }
	 .order_details_1{white-space:normal;width:749upx;height:100%;padding:0upx;clear:both;float:left;background-color:#f6f6f6;text-align:left; border-radius:0upx;font-size:8upx;}
	 .order_details_1 .order_details_7{white-space:normal;width:749upx;height:164upx;padding-left:0upx;padding-right:0upx;padding-top:0upx;padding-bottom:20upx;clear:both;margin-top:0upx;margin-left:0upx;float:left;background-color:#034df4;text-align:left; border-radius:0upx;font-size:8upx;}
	 .order_details_1 .order_details_7 .status{white-space:normal;width:362upx;height:62upx;padding:0upx;clear:both;margin-top:52upx;margin-left:29upx;float:left;text-align:left; border-radius:0upx; color:#ffffff;font-size:33upx; line-height:62upx;}
	 .order_details_1 .order_details_7 .smallTitle{white-space:normal;width:452upx;height:38upx;padding:0upx;clear:both;margin-top:6upx;margin-left:29upx;float:left;text-align:left; border-radius:0upx; color:#ffffff;font-size:26upx; line-height:38upx;}
	 .order_details_1 .order_details_2{white-space:normal;width:690upx;padding:0upx;clear:both;margin-top:20upx;margin-left:29upx;float:left;background-color:#ffffff;text-align:left; border-color:#e1e1e1; border-width:1upx; border-style:solid; border-radius:0upx;font-size:8upx;}
	 .order_details_1 .order_details_2 .goods{white-space:normal;width:690upx;min-height:121upx;padding-left:0upx;padding-right:0upx;padding-top:0upx;padding-bottom:20upx;clear:both;margin-top:0upx;margin-left:0upx;float:left;text-align:left; border-bottom-color:#e1e1e1; border-bottom-width:1upx; border-bottom-style:solid; border-radius:0upx;font-size:8upx;}
	 .order_details_1 .order_details_2 .goods .row{white-space:normal;width:643upx;height:113upx;padding:0upx;margin-top:18upx;margin-left:24upx;float:left;text-align:left; border-radius:0upx;font-size:8upx;}
	 .order_details_1 .order_details_2 .goods .row .pic{white-space:normal;width:91upx;height:90upx;padding:0upx;margin-top:13upx;margin-left:4upx;float:left;text-align:left; border-radius:0upx;font-size:8upx; line-height:90upx;}
	 .order_details_1 .order_details_2 .goods .row .order_details_10{white-space:normal;width:372upx;height:91upx;padding:0upx;margin-top:13upx;margin-left:15upx;float:left;text-align:left; border-radius:0upx;font-size:8upx;}
	 .order_details_1 .order_details_2 .goods .row .order_details_10 .good{white-space:normal;width:366upx;height:43upx;padding:0upx;clear:both;margin-top:0upx;margin-left:0upx;float:left;text-align:left; border-radius:0upx; color:#646464;font-size:33upx; line-height:43upx;}
	 .order_details_1 .order_details_2 .goods .row .order_details_10 .num{white-space:normal;width:234upx;height:29upx;padding:0upx;clear:both;margin-top:12upx;margin-left:0upx;float:left;text-align:left; border-radius:0upx; color:#646464;font-size:22upx; line-height:29upx;}
	 .order_details_1 .order_details_2 .goods .row .money{white-space:normal;width:138upx;height:36upx;padding:0upx;margin-top:13upx;margin-left:19upx;float:left;text-align:right; border-radius:0upx; color:#000000;font-size:24upx; line-height:36upx;}
	 .order_details_1 .order_details_2 .order_details_15{white-space:normal;width:416upx;height:79upx;padding:0upx;clear:both;margin-top:33upx;margin-left:265upx;float:left;text-align:left; border-radius:0upx;font-size:8upx;}
	 .order_details_1 .order_details_2 .order_details_15 .order_details_16{white-space:normal;width:399upx;height:49upx;padding:0upx;margin-top:0upx;margin-left:4upx;float:left;text-align:right; border-radius:0upx; color:#646464;font-size:34upx; line-height:49upx;}
	 .order_details_1 .banner{white-space:normal;width:690upx;height:270upx;padding:0upx;clear:both;margin-top:29upx;margin-left:29upx;float:left;text-align:left; border-radius:0upx;font-size:8upx; line-height:270upx;}
	 .order_details_1 .btAdd{white-space: normal;
    width: 178rpx;
    height: 67rpx;
    padding: 0rpx;
    clear: both;
    margin-top: -15rpx;
    background-color: #2175f3;
    text-align: center;
    justify-content: center;
    border-radius: 13rpx;
    color: #ffffff;
    font-size: 30rpx;
    line-height: 79rpx;}
	.iz_order{
		white-space: normal;
		    width: 690rpx;
		    min-height: 121rpx;
		    padding-left: 0rpx;
		    padding-right: 0rpx;
		    padding-top: 0rpx;
		    padding-bottom: 20rpx;
		    clear: both;
		    margin-top: 0rpx;
		    margin-left: 0rpx;
		    float: left;
		    text-align: left;
		    border-bottom-color: #e1e1e1;
		    border-bottom-width: 1rpx;
		    border-bottom-style: solid;
		    border-radius: 0rpx;
		    font-size: 8rpx;
	}
	.izfuzhi{
		    width: 30%;
		        height: 70rpx;
		        padding: 0rpx;
		        clear: both;
		        margin-top: 36rpx;
		        background-color: #2175f3;
		        text-align: center;
		        justify-content: center;
		        color: #ffffff;
		        font-size: 30rpx;
		        line-height: 79rpx;
		        border-radius: 0rpx 15rpx 15rpx 0rpx;
	}
	.izkm{
		    width: 65%;
		    margin-top: 37rpx;
		    text-align: center;
		    font-size: 30rpx;
		    line-height: 38px;
		    background: border-box;
		    border: 1px solid #2196F3;
		    height: 64rpx;
		    border-radius: 15rpx 0rpx 0rpx 15rpx;
		    margin-left: 15rpx;
	}
	
</style>